import { useEffect, useRef } from "react";
import styled from "styled-components";

interface props {
  stream: MediaStream;
}
const Video = styled.video`
  width: 200px;
  height: 200px;
  position: absolute;
  right: 0;
  top: 0;
`;
export function Camera(props: props) {
  const videoRef = useRef<HTMLVideoElement>(null);
  useEffect(() => {
    if (videoRef.current) {
      videoRef.current.srcObject = props.stream;
    }
  }, []);
  return (
    <>
      <Video ref={videoRef} autoPlay></Video>
    </>
  );
}
